<template>
	<view class="content" v-for="item in list" @click="jump(`/pages/hotel/details/index?id=${item.id}`)">
		<image mode="aspectFill" :src="item?.h_image_arr[0]" style="width: 100%;height: 359rpx"></image>
		<view class="flex flex-ai-c flex-jc-sb" style="padding: 20rpx 23rpx;">
			<view>
				<view class="font-28 font-bold">{{item.h_name}}</view>
				<view class="font-lighter font-20" style="margin-top: 12rpx;">
					<u-icon name="map" size="20rpx" />
					距离您{{item.distance_text}}
				</view>
			</view>
			<view>
				<text style="color: #009943;" class="font-18">￥</text>
				<text style="color: #009943;" class="font-30 font-bold">{{item.min_price}}</text>
				<text class="font-20">起</text>
			</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
	interface Props {
		list : any[]
	}
	const props = withDefaults(defineProps<Props>(), {
		list: () => []
	})
	const jump = (url: string) => {
		uni.navigateTo({
			url: url
		})
	}
</script>

<style lang="scss" scoped>
	.content {
		width: 100%;
		background: #fff;
		border-radius: 20rpx;
		margin-bottom: 30rpx;
		box-shadow: 1px 3px 2px 0px rgba(153, 153, 153, 0.5);
		
	}
</style>